let $image = $(".container img");
// 指定预览区域
let options = {
    aspectRatio: 1,
    // 指定预览区域
    preview: ".preview",
}

$image.cropper(options);

$('#btnChooseImage').click(function(){
    $('#file').click()
})
$('#file').on('change',function(){
    const file = this.files[0]
    if(!file){
        return
    }
    const fileser = URL.createObjectURL(file)
    $image.cropper('destroy')      // 销毁旧的裁剪区域
    .attr('src', fileser)  // 重新设置图片路径
    .cropper(options)        // 重新初始化裁剪区域
})
$('#btnCreateAvatar').click(function () {
    // 剪裁得到一张图片（canvas图片）
    let base64Str = $image.cropper('getCroppedCanvas', { // 创建一个 Canvas 画布
        width: 100,
        height: 100
    });
    // 把图片转成base64格式
    let dataURL = base64Str.toDataURL('image/png'); // 把canvas图片转成base64格式的字符串
    // axios
    console.log(dataURL)
    axios
        .post("/my/update/avatar", `avatar=${encodeURIComponent(dataURL)}`)
        .then((res) => {
            // 提示
            if (res.data.status !== 0) {
                // 失败
                return layer.msg("更新头像失败");
            }
            layer.msg("更新头像成功")
            // 页面中的头像发生变化（更新）
            window.parent.getUsers()
    	});
});